<template>
	<view>
		<form @submit="formSubmit">
		  <view class="cu-form-group">
			  <view class="title">原始密码</view>
			  <input type="password" placeholder="请输入原始密码" name="oriPassword" :value="oriPassword" maxlength="16" @input="oriPass"/>
		  </view>
		 
		  <view class="cu-form-group">
			  <view class="title">登录密码</view>
			  <input type="password" placeholder="请输入字母，或数字建议控制在16位" name="loginPassword" :value="loginPassword" maxlength="16" @input="loginPass" />
		  </view>
		  
		  <view class="cu-form-group">
			  <view class="title">确认密码</view>
			  <input type="password" placeholder="请输入字母，或数字建议控制在16位"  name="quedingPassword" :value="quedingPassword" maxlength="16"  @input="quedingPass"/>
		  </view>

		  <view class="cu-form-group"></view>

		  <view class="padding flex flex-direction btn-view">
			  <button class="cu-btn bg-blue margin-tb-sm lg round guoshao-bg" formType="submit">提  交</button>
		  </view>
	  </form>
	</view>
</template>

<script>
	
	const http = require('../../utils/http.js');
	
	var Authentication = require('../../utils/authentication.js'); 
	
	export default {
		data() {
			return {
				request:false,
				oriPassword: '',
				loginPassword: '',
				quedingPassword: '',
			}
		},
		onLoad() {
		},
		methods: {
			oriPass: function (e) {
			    this.setData({
			        oriPassword: e.detail.value
			    });
			},
			loginPass: function (e) {
			    this.setData({
			        loginPassword: e.detail.value
			    });
			},
			quedingPass: function (e) {
			    this.setData({
			        quedingPassword: e.detail.value
			    });
			},
		
			formSubmit: function (event) {
				
			    let that = this;
				
			    that.setData(event.detail.value);
			    if (!that.checkdForm()) {
			        return;
			    }
				if(that.request){
					return;
				}
			
				this.request = true;
				
			    uni.showLoading({
			        title: '正在修改'
			    });
				var params = {
					baseUrl:true,
				    url: '/p/user/restPass',
				    method: 'POST',
				    data: JSON.stringify(event.detail.value),
				    callBack: function (res) {
				        uni.hideLoading();
				        if (res.code == 200) {
							Authentication.clearCache();
				           uni.showModal({
				           	title:'提示',
							content:'修改成功，请重新登录',
							confirmText:'确定',
							showCancel:false,
							success(res) {
								if(res.confirm){
									Authentication.logout();
								}
							}
				           })
				        } else {
				            uni.showToast({
				                title: res.msg,
				                duration: 2000,
				                icon: 'none'
				            });
							that.request = false;
				        }
						
				    }
				};
				http.request(params);
			},
			checkdForm: function () {
			    let that = this;
			
			    if (that.oriPassword == '') {
			        uni.showToast({
			            title: '请输入原始密码',
			            icon: 'none',
			            duration: 1000
			        });
			        return false;
			    }
				if (that.loginPassword== '') {
				    uni.showToast({
				        title: '请输入登录密码',
				        icon: 'none',
				        duration: 1000
				    });
				    return false;
				}
				if (that.quedingPassword== '') {
				    uni.showToast({
				        title: '请输入确认密码',
				        icon: 'none',
				        duration: 1000
				    });
				    return false;
				}
				
				if (that.quedingPassword != that.loginPassword) {
				    uni.showToast({
				        title: '密码输入不一致',
				        icon: 'none',
				        duration: 1000
				    });
				    return false;
				}
			  
			    return true;
			}
		}
	}
</script>

<style>
@import '../../colorui/main.css';
@import '../../colorui/icon.css';


page {
    background: white;
}

.word {
    margin-top: -30px;
    position: absolute;
    margin-left: 20px;
}

.cu-form-group .title {
    min-width: calc(4em + 15px);
}

.guoshao-bg{
	background-color: #5677fc;
}

.guoshao-choose{
	float: left !important;
	position: absolute !important;
	margin-top: 0px !important;
}

.guoshao-touxian{
	width: 80px !important;
	height: 20px !important;
}

.btn-view{
	bottom: 0;
	position: fixed;
	width: 92%;
}
</style>
